<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
  <meta http-equiv="Expires" content="0">
  <meta http-equiv="Pragma" content="no-cache">
  <meta http-equiv="Cache-control" content="no-cache">
  <meta http-equiv="Cache" content="no-cache">
  <link href="css/ionic.css" rel="stylesheet">
  <script src="js/jquery.min.js"></script>

  <title>评价抽奖</title>
  
    
  <style type="text/css">
    html,body{
      margin: 0 auto;
      width: 100%;
      height: 100%;
    }
    html{
      font-size: 100%;
    }
    body{
          -webkit-touch-callout: none;
      -webkit-font-smoothing: antialiased;
      font-smoothing: antialiased;
      -webkit-text-size-adjust: none;
      -moz-text-size-adjust: none;
      text-size-adjust: none;
      -webkit-tap-highlight-color: transparent;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      overflow: hidden;
      margin: 0;
      padding: 0;
      color: #000;
      word-wrap: break-word;
      font-size: 14px;
      font-family: "Helvetica Neue",Roboto,"Segoe UI",sans-serif;
      line-height: 20px;
      text-rendering: optimizeLegibility;
      -webkit-backface-visibility: hidden;
      -webkit-user-drag: none;
    }
    *, :after, :before{
          -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box; 
    }
        .loading-indicator {
            height: 80px;
            width: 80px;
            background: url( './images/loading.gif' );
            background-repeat: no-repeat;
            background-position: center center;
        }

        .loading-indicator-overlay {
            background-color: #000;
            opacity: 0.6;
            filter: alpha(opacity = 60);
        }
  </style>
</head>
<script src="./js/domain.js"></script>
<body>
      <div class="container" style="width:100%;height:100%;background:url(./img/drawback.jpg);background-size:100% 100%;overflow:scroll">
    <div style="width:100%;height:46%;padding-top:38%;">
      <div style="text-align:center;">
        <span class="surplusCount-wrap" style="visibility:hidden;padding:2px 20px;color:#fff;background-color:rgba(255,255,255,0.2);border-radius:8px">你还有 <span class="surplusCount"></span> 次机会</span>
      </div>
      <div style="padding-top:5px">
        <img src="./img/drawbtn.png" onClick='luckdraw()' style="width:70%;margin-left:15%">
        <img src="./img/sharebtn.png" onClick='prizeRandomM()' style="width:70%;margin-left:15%; margin-top:5px">
      </div>
    </div>
    <div style="width:94%;height:auto;min-height:178px;background-color:#d6e5fd;border-radius:5px;margin:0 auto;padding:10px 20px;color:#2c323b;margin-top:30px">
      <div style="color: #0c5bcf;position: relative;text-align: center;">
        <div style='background-color:#0c5bcf;height:1px;width: 30%;position: absolute;left: 10%;top: 50%;'></div><span>中奖名单</span><div style='background-color:#0c5bcf;height:1px;width: 30%;position: absolute;right: 10%;top: 50%;'></div>
      </div>
      <p class="prizeShowList-0" style="margin-bottom:3px">1:恭喜 <span class="prizeShowList-name" style="font-weight:bold;color:#0c5bcf">--</span> 获得 <span class="prizeShowList-size" style="color:#0c5bcf">--M</span> 邮箱容量</p>
      <p class="prizeShowList-1" style="margin-bottom:3px">2:恭喜 <span class="prizeShowList-name" style="font-weight:bold;color:#0c5bcf">--</span> 获得 <span class="prizeShowList-size" style="color:#0c5bcf">--M</span> 邮箱容量</p>
      <p class="prizeShowList-2" style="margin-bottom:3px">3:恭喜 <span class="prizeShowList-name" style="font-weight:bold;color:#0c5bcf">--</span> 获得 <span class="prizeShowList-size" style="color:#0c5bcf">--M</span> 邮箱容量</p>
      <p class="prizeShowList-3" style="margin-bottom:3px">4:恭喜 <span class="prizeShowList-name" style="font-weight:bold;color:#0c5bcf">--</span> 获得 <span class="prizeShowList-size" style="color:#0c5bcf">--M</span> 邮箱容量</p>
      <p class="prizeShowList-4" style="margin-bottom:3px">5:恭喜 <span class="prizeShowList-name" style="font-weight:bold;color:#0c5bcf">--</span> 获得 <span class="prizeShowList-size" style="color:#0c5bcf">--M</span> 邮箱容量</p>
      <p class="prizeShowList-5" style="margin-bottom:3px">6:恭喜 <span class="prizeShowList-name" style="font-weight:bold;color:#0c5bcf">--</span> 获得 <span class="prizeShowList-size" style="color:#0c5bcf">--M</span> 邮箱容量</p>
    </div>
    <div style="width: 94%;margin: 0 auto;padding-top: 10px;">
      <p style="margin-bottom:5px">活动介绍:</p>
      <p style="text-indent:24px">1.活动时间：2017.11.16到2017.12.15；活动范围：重庆长安汽车股份有限公司全体员工。</p>
      <p style="text-indent:24px">2.活动期间用户每评价一条工单可以获取6次抽奖机会（抽奖次数48小时内有效，每天最多能抽奖3次）。</p>
      <p style="text-indent:24px">3.所抽得的协同邮箱容量可以累计，总容量将在活动结束后2-3个工作日内发放至你的协同账户。</p>
    </div>
  </div>
  <div class="ceng" style="width:100%;height:100%;background-color:rgba(0,0,0,0.85);position:absolute;top:0;color:#FFF;padding-top: 38%;text-align: center;display:none">
    <div>恭喜您获得 <span class="prizeRandom-size">--M</span> 邮箱容量</div>
    <div style="margin-top:5px">您还有 <span class="prizeRandom-count">--</span> 次机会</div>
    <img style="width:50%;margin-top:30px" src="./img/shareimg.png"></br>
    <img onClick="closeCeng()" style="width:10%;margin-top:30px" src="./img/closeicon.png">
  </div>
      <div class="loading" style="width: 100%;height: 100%;position: absolute;top: 0;display:none">
        <div id="loading-indicator-activity_pane-overlay"  class="loading-indicator-overlay" style="width: 100%; height: 100%; position: absolute; z-index: 5000;"></div>
        <div style="text-align: center; position: absolute; z-index: 5001; left: 144px; top: 300px;" id="loading-indicator-activity_pane" class="loading-indicator"></div>
    </div>
  <script type="text/javascript">
     function luckdraw(){
      showLoading()
      $.ajax({
        url: prizeRandomUrl,
        success: function(result){
           hideLoading();
          var data = eval('('+result+')');
          if(data.result == false){
            if(data.message == '用户未登录'){
              alert('请从企业微信或ichangan进行登录访问')
            } else {
              alert(data.message);
            }
          } else {
            prizeShowList();
            $('.prizeRandom-size').html(data.column+'M')
            $('.prizeRandom-count').html(data.leftCount)
            $('.surplusCount').html(data.leftCount)
            $('.surplusCount-wrap').css('visibility','visible');
            // window.prizeId = data.prizeId;
            $(".ceng").show()
          }
        },
        error: function(){
           hideLoading();
        }
      })

     }
    function hideLoading (){
        $('.loading').hide();
    }
    function showLoading (){
        $('.loading').show();
    }
     function closeCeng(){
        $(".ceng").hide()
     }
     function prizeRandomM(){
        var userId = window.userId;
        if(userId){
          showLoading()
          $.ajax({
            url: prizeMyUrl + "?userId="+userId,
            success: function(result){
              hideLoading();
               var data = eval('('+result+')');
              if(data.result == true && data.list){
                  var length = data.list.length;
                  var column = 0;
                  for(var i=0;i<length;i++){
                      column = column + (data.list[i].column || 0);
                  }
                  if(column > 0){
                    window.location.href = './winning.html?userId='+userId;
                  } else {
                    alert('您还未抽奖');
                  }
              }
            },
            error: function(){
               hideLoading();
            }
          })
        } else {
          alert('请从企业微信或ichangan进行登录访问')
        }
     }
     $.ajax({
        url: prizeGetUserInfoUrl,
        type: 'GET',
        success: function(result){
          var data = eval('('+result+')');
          if(data.result == true){
            window.userId = data.userId;
          } 
        },
        error: function(){
        }
      })
     function prizeShowList(){
        $.get(prizeShowListUrl, function(result){
        var data = eval('('+result+')');
        if(data.result == true){
          var length = data.list.length > 6 ? 6 : data.list.length;
          for(var i=0;i<6;i++){
            if(length >i){
              $('.prizeShowList-'+i).show();
              $('.prizeShowList-'+i).find('.prizeShowList-name').html(data.list[i].userName);
              $('.prizeShowList-'+i).find('.prizeShowList-size').html(data.list[i].column+'M');
            } else {
              $('.prizeShowList-'+i).hide();
            }
          }
        } else {
          for(var i=0;i<6;i++){
              $('.prizeShowList-'+i).hide();
          }
        }
        
      });

     }
     prizeShowList();
   </script>

</body>
</html>
